//颜色定义，灰度颜色，正文/图标、副标题/辅助、边框/分隔线、卡片/背景
$color-G100: #141921;
$color-G90: #42464C;
$color-G80: #707378;
$color-G70: #9D9FA2;
$color-G50: #CBCCCE;
$color-G40: #E2E3E3;
$color-G30: #F2F2F2;
$color-G20: #F9F9F9;
//蓝色
$color-B100: #0F3E60;
$color-B90: #207DC2;
$color-B80: #165787;
$color-B70: #208AFF;
$color-B60: #1C70AE;
// $color-B50: #207DC2;
$color-B50: #409EFF;
$color-B40: #217DC2;
$color-B30: #4C97CE;
$color-B20: #79B1DA;
$color-B10: #A5CBE6;
//认可色绿色
$color-GN100: #21672E;
$color-GN80: #2E9140;
$color-GN60: #3CBA53;
$color-GN50: #43D05D;
$color-GN30: #23E140;
$color-GN20: #8EE29D;
$color-GN10: #B3ECBE;
 //警戒色红色
$color-R100: #7F2828;
$color-R80: #B23939;
$color-R60: #E54949;
$color-R50: #FF5252;
$color-R40: #F56C6C;
$color-R30: #FF7474;
$color-R20: #FF9797;
$color-R10: #FFB9B9;

$color-C100: #FFC670;
$color-C90: #FCB774;
$color-C80: #1F242C;
$color-C70: #242930;
$color-C60: #DCDFE6;
$color-C50: #2A3D63;
$color-C40: #606266;
$color-C30: #5E676E;
$color-C20: #EBEEF5;
$color-C10: #e8e8e8;
$color-C33: #333333;

$color-W100: #ffffff;
$color-W90: rgba(255,255,255,.9);
$color-W80: rgba(255,255,255,.8);
$color-W70: rgba(255,255,255,.7);
$color-W60: rgba(255,255,255,.6);
$color-W50: rgba(255,255,255,.5);
$color-W40: rgba(255,255,255,.4);
$color-W30: rgba(255,255,255,.3);
$color-W20: rgba(255,255,255,.2);
$color-W10: rgba(255,255,255,.1);

$color-D100: #000000;
$color-D90: rgba(0,0,0,.9);
$color-D80: rgba(0,0,0,.8);
$color-D70: rgba(0,0,0,.7);
$color-D60: rgba(0,0,0,.6);
$color-D50: rgba(0,0,0,.5);
$color-D40: rgba(0,0,0,.4);
$color-D30: rgba(0,0,0,.3);
$color-D20: rgba(0,0,0,.2);
$color-D10: rgba(0,0,0,.1);

$transparent: transparent;

$base-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
$shallow-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
//字体定义
$font_header_large: 30px;
$font_header_small: 24px;

$font_title_large: 20px;
$font_title_middle: 18px;
$font_title_small: 16px;

$font_body: 14px;
$font_caption: 12px;

@mixin bg-color($lightColor: transparent, $darkColor: transparent){
  background-color: $lightColor;
  [data-theme='custom-light'] & {
    background-color: $lightColor;
  }
  [data-theme='custom-dark'] & { 
    background-color: $darkColor;
  }
}
@mixin bd-color($lightColor: transparent, $darkColor: transparent){
  border-color: $lightColor;
  [data-theme='custom-light'] & {
    border-color: $lightColor;
  }
  [data-theme='custom-dark'] & {
    border-color: $darkColor;
  }
}
@mixin font-color($lightColor: transparent, $darkColor: transparent){
  color: $lightColor;
  [data-theme='custom-light'] & {
    color: $lightColor;
  }
  [data-theme='custom-dark'] & {
    color: $darkColor;
  }
}
@mixin shadow-color($lightColor: none, $darkColor: none){
  box-shadow: $lightColor;
  [data-theme='custom-light'] & {
    box-shadow: $lightColor;
  }
  [data-theme='custom-dark'] & {
    box-shadow: $darkColor;
  }
}
@mixin box-opacity($lightOpacity: 1, $darkOpacity: .3){
  opacity: $lightOpacity;
  [data-theme='custom-light'] & {
    opacity: $lightOpacity;
  }
  [data-theme='custom-dark'] & {
    opacity: $darkOpacity;
  }
}
// 单行文本超出隐藏
@mixin overRow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
